<!DOCTYPE html>
<html>
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
	<title>系统角色分配系统功能</title>
	<link rel="stylesheet" type="text/css" href="../jquery-easyui-1.5.3/themes/bootstrap/easyui.css"  disabled="disabled" /> 
	<link id="easyuiTheme" rel="stylesheet" type="text/css" href="../jquery-easyui-1.5.3/themes/default/easyui.css">
	<link rel="stylesheet" type="text/css" href="../jquery-easyui-1.5.3/themes/icon.css">
	<script type="text/javascript" src="../jquery-easyui-1.5.3/jquery.min.js"></script>
	<script type="text/javascript" src="../jquery-easyui-1.5.3/jquery.easyui.min.js"></script>
	<script type="text/javascript">
		function getValue(name){
			var str=window.location.search;
			if (str.indexOf(name)!=-1){
				var pos_start=str.indexOf(name)+name.length+1;
				var pos_end=str.indexOf("&",pos_start);
				if (pos_end==-1){
					return str.substring(pos_start);
				}	else	{
					return str.substring(pos_start,pos_end)
				}
			}	else	{
				return "";
			}
		}
		
		var  themeName = getValue("theme");
		if (themeName!=""){
		    var cssurl  = $('#easyuiTheme').attr('href');  
		    var href = cssurl.substring(0, cssurl.indexOf('themes')) + 'themes/' + themeName + '/easyui.css';  
		    $('#easyuiTheme').attr('href', href);  
		}
		
		document.onkeydown = keyboardControl;
		function keyboardControl(){   
			//截取ESC键
			if (window.event.keyCode==27) {  
				/**
				window.event.keyCode=0;   
				window.event.returnValue=false;   
				return false;
				
		 		var node = $('#FunctionTree').tree('getSelected');	
				$('#FunctionTree').tree('cancelEdit',node.target);	*/
			}   
		} 
		
		function getRootPath(){  
		    //获取当前网址，如： http://localhost:8083/proj/meun.jsp  
		    var curWwwPath = window.document.location.href;  
		    //获取主机地址之后的目录，如： proj/meun.jsp  
		    var pathName = window.document.location.pathname;  
		    var pos = curWwwPath.indexOf(pathName);  
		    //获取主机地址，如： http://localhost:8083  
		    var localhostPath = curWwwPath.substring(0, pos);  
		    //获取带"/"的项目名，如：/proj  
		    var projectName = pathName.substring(0, pathName.substr(1).indexOf('/')+1);  
		    return(localhostPath + projectName);  
		}
		
		//修改菜单树(递归方式) BEGIN
	 	function modTree(node){
	 		var menuTree = node;
			menuTree.text = node.name;
	 		menuTree.children_tmp = [];
			if (node.level=='3'){
				menuTree.state = 'closed';
			} 
			for (var i in node.children){
				menuTree.children_tmp.push(modTree(node.children[i]));
			}
			menuTree.children = menuTree.children_tmp ;
	 		return menuTree;
	 	}
	 	//修改菜单树(递归方式)  END
		
	 	//右键菜单-添加子节点  BEGIN
	 	function append(){
	 		alert('添加子节点');
	 	}
	 	//右键菜单-添加子节点  END
	 	
	 	//右键菜单-重命名  BEGIN
	 	var oldName = '';//全局变量，存储旧名字。
	 	function rename(){
	 		var node = $('#FunctionTree').tree('getSelected');	
	 		oldName = node.text;
	 		$('#FunctionTree').tree('beginEdit',node.target);
	 	}
	 	//右键菜单-重命名 END	 		 	
	 	
	 	//右键菜单-修改信息  BEGIN
	 	function modify(){
	 		var node = $('#FunctionTree').tree('getSelected');	
	 		$('#FunctionInfo').window({title:'功能【'+node.id+'】的信息'});
	 		$('#InfoFunctionName').textbox({value:node.text});
	 		$('#InfoFunctionURL').textbox('setValue',node.url==='null'?'':node.url);
	 		$('#InfoFunctionTitle').textbox('setValue',node.title==='null'?'':node.title);
	 		$('#FunctionInfo').window('open');
	 	}
	 	//右键菜单-修改信息 END	 	
	 	
	 	
	 	//获取系统角色树的数据
		function getRoleTreeData(){
			var obj = $.ajax({url:getRootPath()+"/auth/RoleManage.let?action=getChildrenRoleTreeByLoginProjectRoleID",async:false});
			var jsonData =  eval("(" + obj.responseText + ")"); 
			var  res = [];
			for (var i in jsonData) {
				res.push(modTree(jsonData[i]));
			}
			return res;
	 	}	
		//赋值系统角色树的数据
		var  roleTreeData = getRoleTreeData();
		
		//获取系统功能树的数据的旧方法
		function getFunctionTreeData(){
			var obj = $.ajax({url:getRootPath()+"/auth/FunctionManage.let?action=getFunctionTreeByProjectRoleID",async:false});
			var jsonData =  eval("(" + obj.responseText + ")"); 
			var  res = [];
			for (var i in jsonData) {
				res.push(modTree(jsonData[i]));
			}
			return res;
	 	}	
		//赋值系统功能树的数据
		var  functionTreeData = getFunctionTreeData();
		
		//递归的方式将functionTree的ID转成一个数组
		function getFunctionIDList(node){
			var res = [];
			res.push(node.id);
			for (var i in node.children){
				res.push(getFunctionIDList(node.children[i]));
			}
	 		return res;
		}
		
		//根据RoleID获取系统功能ID列表
		function getFunctionByRoleID(roleID){
			var url = getRootPath()+"/auth/FunctionManage.let?action=getFunctionTreeByRoleID&roleID="+roleID;
			//var obj = $.ajax({url:url,async:false});	
			//var obj = $.ajax({
			var deferred = $.Deferred();
			$.ajax({
			    type:'POST',
			    url:url,
			    //data:obj,
			    //dataType:'json',
			    //async:false,//设置为同步模式，确保操作完成再进行下一步。
			    beforeSend: function () {
					$.messager.progress({ 
						title: '提示', 
						msg: '操作进行中，请稍候……', 
						text: '' 
					});
					//setTimeout("pause()",9000); 
			    },
			    complete: function () {
					$.messager.progress('close');
			    },
			    success: function(data){
			    	var jsonData =  eval("(" + data.responseText + ")"); 
					var  res = [];
					for (var i in jsonData) {
						res.push(getFunctionIDList(jsonData[i]));
					}
					deferred.resolve(res);		    	 			    	
			    }
			});
			alert(deferred.promise);
			return deferred.promise;
	 	}	
		//赋值系统功能树的数据
		var  functionTreeData = getFunctionTreeData();
		
		//根据角色tree中被点中的节点，将功能树中对应的功能勾选上。
		function setFunctionTreeChecked(node){
			var checkedNodes = $('#FunctionTree').tree('getChecked', ['checked','indeterminate']);
			for (var i in checkedNodes){
				$('#FunctionTree').tree('uncheck', checkedNodes[i].target);	
			}
			var list = eval("(" + "["+getFunctionByRoleID(node.id)+"]" + ")"); 
			for (var i=0; i<list.length; i++){
				var node2 = $('#FunctionTree').tree('find', list[i]);
				if ($('#FunctionTree').tree('getChildren', node2.target).length==0){
					$('#FunctionTree').tree('check', node2.target);	
				}
			}
		}
		
		//更新角色的功能菜单
		function updateRoleFunction(node){
			//获取功能树中被勾选的功能，及其上层功能。
			var nodes = $('#FunctionTree').tree('getChecked', ['checked','indeterminate']);
			var s = '';
			for(var i in nodes){
				if (s != '') s += ',';
				s += nodes[i].text;
			}
			alert(s);
		}		
		
		$(function(){
			$('#FunctionInfo').window('close');		  
			//树形上面面板的两个按钮
			$('#FunctionTreePanel').panel({
			    tools:[{
				    iconCls:'icon-reload',
				    handler:function(){
						var roleNode = $('#RoleTree').tree('getSelected');
						setFunctionTreeChecked(roleNode);
			   		 }
			    },{
				    iconCls:'icon-ok',
				    handler:function(){
						var roleNode = $('#RoleTree').tree('getSelected');
						$.messager.confirm('操作确认', '确定要更新系统角色【'+roleNode.name+'】的功能吗？', function(r){
							if (r){
								updateRoleFunction(roleNode);
							}
						});
					}
			    }]
			}); 
			//系统角色树
		    $('#RoleTree').tree({		       
		        data:roleTreeData,
				animate:true,
				lines:true,
				dnd:true,
				onLoadError: function(arguments){
					alert(arguments);
				},
				onClick: function(node){
					$('#FunctionTreePanel').panel({title:'系统角色【'+node.name+'】的功能列表：'});
					setFunctionTreeChecked(node);
				},
				onDblClick: function(node){	
					//双击展开或者关闭
					$(this).tree(node.state === 'closed' ? 'expand' : 'collapse', node.target);
					node.state = node.state === 'closed' ? 'open' : 'closed'; 
				},			
				onAfterEdit: function(node){
					$.messager.confirm('操作确认', '确定将功能['+oldName+']名称修改为['+node.text+']吗？', function(r){
						if (r){
							node.name=node.text;
						} else {
							$('#RoleTree').tree('cancelEdit',node.target);	
						}
					});	
				},			
				onCancelEdit: function(node){
					node.text = oldName;
					//$(this).tree('update', {target:node.target, text:node.text});
					$('#RoleTree').tree('update', {target:node.target, text:node.text});
				},
			    onContextMenu: function(e, node){
					e.preventDefault();
					// select the node
					$('#RoleTree').tree('select', node.target);
					$('#FunctionTreePanel').panel({title:'系统角色【'+node.name+'】的功能列表：'});
					// display context menu
					$('#RoleTreeContextMenu').menu('show', {
						left: e.pageX,
						top: e.pageY
					});
				},
				onBeforeDrop: function(target,source,point){
					var targetNode = $('#RoleTree').tree('getNode',target);
					$.messager.confirm('操作确认', '确定将功能['+source.text+'] '+point+' ['+targetNode.text+']吗？', function(r){
						if (r){
							
						} else {
							return false;					
						}
					});	
				},
				onDrop: function(target,source,point){
					var targetNode = $('#RoleTree').tree('getNode',target);
					$.ajax({
						url: '...',
						type: 'post',
						dataType: 'json',
						data: {
							id: source.id,
							targetId: targetId,
							point: point
						}
					});
				}
		    });
			
			//系统功能树
		    $('#FunctionTree').tree({
		        data:functionTreeData,
				animate:true,
				lines:true,
				dnd:true,
				checkbox:true,
				cascadeCheck:true,
				onLoadError: function(arguments){
					alert(arguments);
				},
				onClick: function(node){

				},
				onDblClick: function(node){	
					//双击展开或者关闭
					$(this).tree(node.state === 'closed' ? 'expand' : 'collapse', node.target);
					node.state = node.state === 'closed' ? 'open' : 'closed'; 
				},			
				onAfterEdit: function(node){
					$.messager.confirm('操作确认', '确定将功能['+oldName+']名称修改为['+node.text+']吗？', function(r){
						if (r){
							node.name=node.text;
						} else {
							$('#FunctionTree').tree('cancelEdit',node.target);	
						}
					});	
				},			
				onCancelEdit: function(node){
					node.text = oldName;
					//$(this).tree('update', {target:node.target, text:node.text});
					$('#FunctionTree').tree('update', {target:node.target, text:node.text});
				},
				onBeforeDrop: function(target,source,point){
					var targetNode = $('#FunctionTree').tree('getNode',target);
					$.messager.confirm('操作确认', '确定将功能['+source.text+'] '+point+' ['+targetNode.text+']吗？', function(r){
						if (r){
							
						} else {
							return false;					
						}
					});	
				},
				onDrop: function(target,source,point){
					var targetNode = $('#FunctionTree').tree('getNode',target);
					$.ajax({
						url: '...',
						type: 'post',
						dataType: 'json',
						data: {
							id: source.id,
							targetId: targetId,
							point: point
						}
					});
				}
		    });
		})
	</script>
</head>
<body>	
	<div class="easyui-layout" data-options="fit:true">	
		<!-- 左侧的系统角色树窗口 -->
		<div id="RoleTreePanel" class="easyui-panel"  title="系统角色"  style="width:30%;padding:5px" data-options="region:'west',split:true">
			<ul id="RoleTree" class="easyui-tree" ></ul>
		</div>
		<!-- 右侧的系统功能树窗口 -->
		<div id="FunctionTreePanel" class="easyui-panel"  title="系统功能"  style="padding:5px" data-options="region:'center',split:true">
			<ul id="FunctionTree" class="easyui-tree" ></ul>
		</div>
	</div>
</body>
</html>